import React, { useMemo } from 'react'
import styles from './index.module.less'
import type { CheckboxScheme } from '../../interface'

export default function Radio(props: { scheme: CheckboxScheme; answers: any[]; idx: number }) {
    const { scheme, answers = {} as any, idx } = props
    const { properties } = scheme || {}
    /** 其他答案 */
    // const answersLabel = useMemo(() => {
    //     let result: Record<string, string> = {}
    //     answers.forEach(item => {
    //         if (item.hasOther) {
    //             result[item.uuid] = item.label
    //         }
    //     })
    //     return result
    // }, [answers])

    return (
        <div className={styles.radio_container}>
            <div className={styles.question}>
                {idx}、{properties?.title}
            </div>
            {properties?.content
                ?.filter(item => answers?.uuid === item?.uuid)
                ?.map(item => {
                    return (
                        <div key={item?.label} className={styles.checked}>
                            <span className={styles.checked_icon} /> <span>{item.hasOther ? answers?.label : item?.label}</span>
                        </div>
                    )
                })}
        </div>
    )
}
